<template>
  <span class="v-icon-wrapper"
    @click="click"
    :class="wrapperClass"
  >
    <i
      :class="['icon', 'iconfont', `icon-${name}`]"
      :style="{
        fontSize,
        color,
      }"
    />
  </span>
</template>
<script>

export default {
  name: 'Iconfont',
  props: {
    name: {
      type: String,
      required: true,
    },
    fontSize: String,
    color: String,
    wrapperClass: String,
  },
  methods: {
    click(evt) {
      this.$emit('click', evt)
    },
  },
}
</script>

<style>
.v-icon-wrapper {
  display: inline-block;
}
</style>
